<!--
 * @Author: 刘鑫
 * @Date: 2020-11-10 21:30:25
 * @LastEditors: 刘鑫
 * @LastEditTime: 2020-11-11 07:37:58
 * @Description: 
-->

<template>
  <div id="app">
    <router-view id="view" />
    <div id="nav">
      <router-link to="/home">首页</router-link>
      <router-link to="/classify">分类</router-link>
      <router-link to="/msg">消息</router-link>
      <router-link to="/my">我的</router-link>
    </div>
  </div>
</template>

<style lang="scss" scoped>
#app {
  display: flex;
  flex-direction: column;
}
#view {
  flex: 1;
  overflow-y: auto;
}

#nav {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 100%;
  height: 0.4rem;
  border-top: 0.01rem solid #ccc;
  a {
    color: #686767;
    text-decoration: none;
    &.router-link-exact-active {
      color: #8602ba;
    }
  }
}
</style>
